<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=9,IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="renderer" content="webkit">
    <meta charset="UTF-8">
    <title>投票</title>
    <style>
        body{background: #EFEFF4}
        .content p{padding-top: 20px; }
    </style>
    <link rel="stylesheet" type="text/css" href="<%=basePath%>/app/plugins/flavr/css/flavr.css">
    <link rel="stylesheet" type="text/css" href="<%=basePath%>/app/css/appLogin.css">
    <link rel="stylesheet" type="text/css" href="<%=basePath%>/app/plugins/dialog/css/dialog.css" />

</head>
<body>
<!--vote-detail-wrapper-->
<div class="vote-detail-wrapper" data-MH="true" id="content-detail">
    <script type="text/html" id="tplVote">
        <section class="top-info">
            <h3>{{info.title}}</h3>
        </section>
        <section class="content">
            <img src="{{info.theme_pic}}" alt="" />
            <p>活动介绍</p>
            <div>{{#info.content}}</div>
            <p>活动时间</p>
            <div>{{formatTime(info.start_time,'MM月dd日 HH:ii', false)}} - {{formatTime(info.end_time,'MM月dd日 HH:ii', false)}}</div>
            <p>投票次数</p>
            <div>{{info.num}}</div>
        </section>
        <section class="name-list">
            <header>候选名单</header>
            <article>
                {{each voteList as value i}}
                <a class="item">
                    <dl>
                        <dt><img src="{{value.pic_url}}" alt="" /></dt>
                        <dd>
                            <h3>
                                <span class="number"><span class="red">{{value.vote_num}}</span>票</span>
                                <span class="tit">{{value.title}}</span>
                            </h3>
                        </dd>
                        <dd class="btn"><button type="button" class="vote" id="vote{{value.id}}" data-id="{{value.id}}">投票</button></dd>
                    </dl>
                </a>
                {{/each}}
            </article>
        </section>
    </script>
</div>
<!--/vote-detail-wrapper-->
<script type="text/javascript" src="<%=basePath%>/app/plugins/flavr/js/myFlavr.js"></script>
<script type="text/javascript" src="<%=basePath%>/app/plugins/dialog/js/dialog.js"></script>
<script type="text/javascript">
    $(function(){
        loadData();

        mui('body').on("tap", ".vote", function () {
            var _ele = $(this);
            checkLogin(function () {
                vote(_ele);
            },function () {
                initLogin()
            });
        });
    });

    function vote(_ele) {
        var _id = _ele.data("id");
        $.ajax({
            url: _basePath + "app/act/vote",
            data: {id: _id, interaction_id:${id}},
            dataType: "json",
            type: "post",
            success: function (data) {
                if (typeof data != undefined && data.resCode == 0) {
                    var _p = _ele.parent().parent();
                    _p.find(".red").html(parseInt(_p.find(".red").text()) + 1);
                    mui.toast("投票成功");
                } else {
                    mui.toast(data.message);
                }
            }
        })
    }
    
    function loadData() {
        $.ajax({
            url: _basePath + "app/act/voteDetail",
            data: {id: '${id}'},
            dataType: 'json',
            success: function (data) {
                if(typeof data != undefined && data.resCode == 0){
                    var _html = template('tplVote', data.resultList);
                    shareWx(window.location.href,data.resultList.info.theme_pic,data.resultList.info.title,data.resultList.info.title);
                    $("#content-detail").append(_html);
                    registerReset();
                }else{
                    mui.toast(data['message']);
                }
            }
        });
    }
</script>